import { ref, onMounted } from 'vue';
import { ElMessage, ElTable } from 'element-plus';
import { request } from '@/utils/request';

interface WorkflowResponse {
  success: boolean;
  data: Workflow[];
  message?: string;
}

interface Workflow {
  id: string;
  name: string;
  description?: string;
  category: string;
  workflow_json?: any;
  preview_image?: string;
  created_at: string;
  updated_at: string;
}

const workflows = ref<Workflow[]>([]);

const fetchWorkflows = async () => {
  try {
    const response = await request<WorkflowResponse>('/api/v1/workflows');
    // 确保 workflows.value 是数组
    workflows.value = Array.isArray(response.data) ? response.data : [];
    console.log('API响应:', response);
    console.log('工作流数据:', response.data);
    console.log('数据类型:', Array.isArray(response.data) ? 'Array' : typeof response.data);
  } catch (error) {
    console.error('获取工作流列表失败:', error);
    ElMessage.error({
      message: '获取工作流列表失败: ' + (error instanceof Error ? error.message : '未知错误'),
      duration: 5000,
      showClose: true
    });
    workflows.value = []; // 出错时设置为空数组
  }
};

onMounted(() => {
  fetchWorkflows();
});